import React, { useState } from "react";
import Team from "../team/index";
import Case from "../case/index";
import Start from "../start/index";
import Process from "../process/index";
import Problem from "../problem/index";
import style from "./index.module.less";
import icon1 from "@/style/imgs/support/tb7.1d0fa6d.png";
import icon2 from "@/style/imgs/support/tb22.5255351.png";
import icon3 from "@/style/imgs/support/tb23.482f958.png";
import icon4 from "@/style/imgs/support/tb1.7c1e572.png";
import icon5 from "@/style/imgs/support/tb2.b595668.png";
import icon6 from "@/style/imgs/support/tb27.30225df.png";

const PingguPage = () => {
  const [flowList, setFlowList] = useState([
    { title: "投稿期刊推荐", icon: icon1, type: 1, desic: "旨在帮助您更好地了解自己稿件的水平，划定合适的投稿期刊范围，从而让您在期刊选择时避免走不必要的弯路，缩短稿件被接收的周期。编辑会根据您的文章先进行编辑前评审评估，总结成一份预评估报告（Pre-evaluation report）；并按照您对于期刊的要求，推荐3个目标期刊，填写一份期刊推荐表。", tableTitle: "投稿期刊推荐服务价目表", row1: "5个工作日", row2: "￥1000" },
    {
      title: "稿件格式修改",
      icon: icon2, type: 2,
      desic1: "很多科研工作者由于缺乏投稿经验，会因为难以达到目标期刊的格式要求而在期刊初审时被退稿，又或者因为对于某个期刊的投稿系统不熟悉而无法顺利完成稿件提交。我们针对这类客户提供稿件格式修改服务和协助提交稿件服务。",
      desic2: "稿件格式修改服务会根据您提供的目标期刊格式要求对您的文章进行全面的格式修改和调整，从而让您避免因稿件格式不符合投稿期刊的要求而遭到退稿（非拒稿）的情况。",
      title2: "修改和调整的内容包括",
      title3: "稿件格式修改服务不包括以下几种情况",
      list1: ["小标题、要点、关键词等内容的格式调整", "摘要模式的修改（是否有subheading等）", "字体，行距，段落等格式修改", "稿件内文字表格的格式修改或调整", "稿件整体格式的修改（材料方法所在位置等）", "带有EndNote索引的文献格式修改", "稿件中图片和图例位置的调整"],
      list2: ["图片修改（图片分辨率，图片中字体以及图片的格式等）", "文章字数调整（客户需保证文章字数在期刊规定范围内）", "结果与讨论部分的合并或拆分", "文章正文部分与补充材料内容的增添或删减", "文章语法和内容上的纠错或调整", "非EndNote索引导入的文献格式修改", "稿件中的公式与特殊字符类的调整",],
      footer1: "最终使您的稿件的正文文字部分和文字表格完全符合目标期刊的投稿标准。",
      footer2: "结果与讨论部分的合并或拆分；文章正文部分与补充材料内容的增添或删减；文章语法和内容上的纠错或调整这三种情况可选择润色服务。",
      tableTitle: "稿件格式修改服务价目表",
      row1: "3个工作日",
      row2: "￥1000"
    },
    { title: "投稿附信撰写", icon: icon3, type: 1, desic: "绝大部分文章在投稿时都需要提供一封投稿附信（cover letter），以突出文章所包含的重要研究成果与应用价值。我们的专业编辑可以按照您提供的稿件内容，为您撰写这封投稿附信，以便期刊编辑更直观地了解您的研究，提升对您投稿文章的第一印象。", tableTitle: "投稿附信撰写服务价目表", row1: "2个工作日", row2: "￥500" },
    { title: "协助提交稿件", icon: icon4, type: 1, desic: "旨在帮助您将稿件提交至目标期刊投稿系统，从而让您避免因对某个投稿系统不熟悉而耽误宝贵时间，甚至因误操作而导致退稿或拒稿。但该服务不对因文章内容产生的拒稿和实际投稿产生的费用（如“版面费”）负责。", tableTitle: "协助提交稿件服务价目表", row1: "2个工作日", row2: "￥500" },
    { title: "协助回复审稿意见", icon: icon5, type: 1, desic: "回复审稿意见是科学论文被期刊接收之前的最后一步。能否完美地答复审稿人提出的审稿意见，往往决定着一次投稿经历的成败。回答审稿意见，不仅包括直接地正面地回应科学问题，也包括间接地侧面地解释或者抗辩质疑（英文称为rebuttal letter）。作者回答审稿人的所有问题后，我们的编辑将协助作者保证逻辑的合理性，语言的流畅性和专业性，以及回复信整体的规范性。如果您同时需要对已修改的文章进行润色，或只需要简单润色回复审稿意见的语言，请参考我们的润色编辑服务；如果您需要我们的专业编辑根据审稿意见，直接对您的回复审稿意见初稿与修改后的文章进行详细的内容调整或大修定稿，请参考我们的全程无忧发表服务。", tableTitle: "协助回复审稿意见服务价目表", row1: "7个工作日", row2: "5个工作日", row3: "3个工作日", row4: "￥1.00/词", row5: "￥1.20/词", row6: "￥1.40/词", },
    { title: "短文快速优化", icon: icon6, type: 1, desic: "万方寰宇提供最快的短文润色与翻译加急服务，帮助广大科研学者在最短的时间内针对文章的某一章节或段落进行优化与修改，以保证科研工作者们争分夺秒完成投稿或答复审稿意见的任务，助力整体推进文章快速发表见刊。", tableTitle: "短文快速优化服务价目表", row1: "标准润色", row2: "深度润色", row3: "常规学术翻译", row4: "￥1.40/词", row5: "￥1.90/词", row6: "￥1.80/词" },
  ]);

  return <>
    {/* 头部介绍 */}
    <div className={style.banner}>
      <div className={style.banner_content}>
        <div className={`h2 black ${style.h2}`}>通过独特的发表支持服务，大大缩短和简化投稿流程并提高成功率</div>
        <div className="h3 black">
          • 3000+学科编辑对应匹配
        </div>
        <div className="h3 black">
          • 100%对应学科博士一对一支持
        </div>
        <div className="h3 black">
          • 全方位投稿支持
        </div>
      </div>
    </div>
    {/* 为什么选择发表支持服务 */}
    <div className={style.prequalification}>
      <div className={`h2 black ${style.h2}`}>为什么选择发表支持服务</div>
      <div className={style.pre_item}>
        <span>1</span>
        <span>很多科研工作者由于缺乏投稿经验，可能在投稿过程中遇到种种问题：会因为不了解自己稿件的水平而不知道投稿期刊范围；会因为难以达到目标期刊的格式要求而在期刊初审时被退稿，又或者因为对于某个期刊的投稿系统不熟悉而无法顺利完成稿件提交。</span>
      </div>
      <div className={style.pre_item}>
        <span>2</span>
        <span>万方寰宇SCI论文英语润色团队全部由母语为英语且具有相关专业背景的SCI论文编辑或长期从事英文SCI论文编译、润色的华人专家组成。 他们不仅语言功底深厚，且均有相关专业研究背景。我们会根据您的论文研究领域选择相应专家提供服务。</span>
      </div>
      <div className={style.pre_item}>
        <span>3</span>
        <span>万方寰宇为广大科研人员提供全方位的发表支持服务，包括推荐投稿期刊、调整论文格式、撰写投稿附信、整理文章摘要、协助提交稿件、协助回复审稿意见等，为提升您文章的投稿效率与发表概率助力</span>
      </div>
    </div>
    {/* 发表支持服务 */}
    <div className={style.select_body}>
      <div className={`h2 black ${style.h2}`}>发表支持服务</div>
      <div className={style.select_content}>
        <div className={style.select_item}>
          <img src={icon1} alt="图片加载失败" />
          <div className="h4 black">投稿期刊推荐</div>
        </div>
        <div className={style.select_item}>
          <img src={icon2} alt="图片加载失败" />
          <div className="h4 black">稿件格式修改</div>
        </div>
        <div className={style.select_item}>
          <img src={icon3} alt="图片加载失败" />
          <div className="h4 black">投稿附信撰写</div>
        </div>
        <div className={style.select_item}>
          <img src={icon4} alt="图片加载失败" />
          <div className="h4 black">协助提交稿件</div>
        </div>
        <div className={style.select_item}>
          <img src={icon5} alt="图片加载失败" />
          <div className="h4 black">协助回复审稿意见</div>
        </div>
        <div className={style.select_item}>
          <img src={icon6} alt="图片加载失败" />
          <div className="h4 black">短文快速优化</div>
        </div>
      </div>
    </div>
    {/* 流程介绍 */}
    <div className={style.select_flow}>
      {flowList.map((item: any, index: number) => {
        if (item.type === 1) {
          const dom: any = <div className={style.flow_item} key={index}>
            <div className={style.flow_header}>
              <img src={item.icon} alt="图片加载失败" />
              <span>{item.title}</span>
            </div>
            <div className={style.flow_desic}>
              {item.desic}
            </div>
            {([4, 5].includes(index)) &&
              <div className={style.flow_table}>
                <div className={style.table_title}>{item.tableTitle}</div>
                <ul>
                  <li>
                    <span>服务周期</span>
                    <span>{item.row1}</span>
                    <span>{item.row2}</span>
                    <span>{item.row3}</span>
                  </li>
                  <li>
                    <span>费用</span>
                    <span>{item.row4}</span>
                    <span>{item.row5}</span>
                    <span>{item.row6}</span>
                  </li>
                </ul>
              </div>}
            {![4, 5].includes(index) &&
              <div className={style.flow_table}>
                <div className={style.table_title}>{item.tableTitle}</div>
                <ul>
                  <li>
                    <span>服务周期</span>
                    <span>{item.row1}</span>
                  </li>
                  <li>
                    <span>费用</span>
                    <span>{item.row2}</span>
                  </li>
                </ul>
              </div>}
          </div>;
          return dom;
        } else {
          return <div className={style.flow_item2} key={index}>
            <div className={style.flow_header}>
              <img src={item.icon} alt="图片加载失败" />
              <span>{item.title}</span>
            </div>
            <div className={style.flow_desic}>
              {item.desic1}
            </div>
            <div className={style.flow_desic}>
              {item.desic2}
            </div>
            <div className={style.list_content}>
              <div className={style.list_a}>
                <div className={`${style.title} h4`}>{item.title2}</div>
                {item.list1.map((itemx: any, indexx: number) => {
                  return <div className={style.list_item} key={indexx}>
                    <span>{indexx + 1 + ". " + itemx}</span>
                    <span>✓</span>
                  </div>
                })}
              </div>
              <div className={style.list_a}>
                <div className={`${style.title} h4`}>{item.title2}</div>
                {item.list2.map((itemx: any, indexx: number) => {
                  return <div className={style.list_item} key={indexx}>
                    <span>{indexx + 1 + ". " + itemx}</span>
                    <span>×</span>
                  </div>
                })}
              </div>
            </div>
            <div className={style.flow_table}>
              <div className={style.table_title}>{item.tableTitle}</div>
              <ul>
                <li>
                  <span>服务周期</span>
                  <span>{item.row1}</span>
                </li>
                <li>
                  <span>费用</span>
                  <span>{item.row2}</span>
                </li>
              </ul>
            </div>
          </div>;
        }
      })}
    </div>
    {/* 服务流程 */}
    <Process />
    {/* 发表案例 */}
    <Case />
    {/* 客户好评 */}
    <Start />
    {/* 服务质量保证 */}
    <div className={style.assurance_body} >
      <div className={`h2 black ${style.h2}`}>服务质量保证</div>
      <p>经万方寰宇深度润色或终极润色服务修改后的完整稿件可以满足期刊对文章的语言要求。如果投稿期刊的编委或者审稿人指出我们的返稿文件中有具体的语言问题，您可以将原始的审稿意见提交给我们，万方寰宇会负责免费重修这些有问题的句段，直至满足该投稿期刊的语言要求。</p>
      <p>注：润色服务旨在提高文章语言质量，但不保证文章的重复率满足投稿期刊的要求，即可能会造成润色后文章整体重复率的上升或下降。如果客户对文章有重复率方面的顾虑或担忧，请参考我们的查重去重服务。</p>
      <div className={`h2 black ${style.h2}`}>免责声明</div>
      <p>在客户选择某一等级的服务后，万方寰宇编辑经过初始评估可能会提出升级服务的要求，如果客户坚持原服务等级，则万方寰宇不对该文章在审稿过程中被指出的语言问题负责。此外，在万方寰宇润色服务结束后，若客户在润色的最终完整稿件中自行添加或修改文字，或者没有接受万方寰宇编辑对语言的修改与建议，导致文章被投稿期刊指出语言问题，则我们也不负责对该稿件进行免费重修。</p>
      {/* <div className={`h2 black ${style.h2}`}>服务时限保证</div>
      <p>万方寰宇向客户承诺将在规定的时限内将稿件编辑/翻译/评阅完毕，并将修改稿、翻译稿、各类评审报告等返回给客户。如有超期返稿的情况，将按以下标准给客户返还一部分项目费用：</p>
      <p>1. 若超过规定返稿时限12小时以上，24小时以下，则返还项目费用总额的5%。</p>
      <p>2. 若超过规定返稿时限24小时以上，48小时以下，则返还项目费用总额的10%。</p>
      <p>3. 若超过规定返稿时限48小时以上，则返还项目费用总额的20%。</p>
      <p>注：随着我们稿件数量的大幅增加，客服和技术人员的工作压力也越来越大。因此，在返稿截止时限前不接受催促编辑返稿或让编辑提前返稿等要求，敬请理解！</p> */}
    </div>
    {/* 编辑团队 */}
    <Team />
    {/* 常见问题 */}
    <Problem />
  </>
}

export default PingguPage;